<template>
    <!-- <div class="common-layout"> -->
        <el-container>
            <el-header style="padding: 0">
                <el-menu
                    class="el-menu-demo"
                    @select="handleSelect"
                    :default-active="proxy.router.currentRoute.value.path"
                    :ellipsis="false"
                    mode="horizontal"
                    router
                    background-color="#545c64"
                    text-color="#fff"
                    active-text-color="#ffd04b"
                    style="display: flex; justify-content: space-between; align-items: center;"
                >
                    <el-menu-item index="home">
                        <template #title>
                            <span>论坛管理系统</span>
                        </template>
                    </el-menu-item>
                    <el-sub-menu index="home">
                        <template #title>{{ userInfo.name }}</template>
                        <el-menu-item index="logout">退出登录</el-menu-item>
                    </el-sub-menu>
                </el-menu>
            </el-header>
            <el-container>
                <el-aside width="200px" height="100vh">
                    <el-menu
                        :default-active="proxy.router.currentRoute.value.path"
                        class="el-menu-vertical-demo"
                        router
                    >
                        <el-menu-item index="user">用户管理</el-menu-item>
                        <el-menu-item index="forum">帖子管理</el-menu-item>
                    </el-menu>
                </el-aside>
                <el-main>
                    <router-view></router-view>
                </el-main>
            </el-container>
        </el-container>
    <!-- </div> -->
</template>

<script setup>
import { getCurrentInstance, ref } from 'vue';

const { proxy } = getCurrentInstance()
const userInfo = {
    name: '',
    account: ''
}
// const defaultActive = ref('/home')

const init = () => {
    let loginUser = proxy.cookies.get('bbs-admin')
    // let loginUser = JSON.parse(sessionStorage.getItem("bbs-admin"))
    userInfo.name = loginUser.name
    userInfo.account = loginUser.account
}

init()

const handleSelect = (key, keyPath) => {
    // defaultActive.value = key
    // sessionStorage.setItem('default-active', key)
    if(key == 'logout') {
        // proxy.cookies.remove('bbs-admin')
        // proxy.router.push('/login') // router已经全局挂载
        sessionStorage.removeItem('bbs-admin')
		proxy.router.push('/login')
    }
    if(key == 'home') {
        proxy.router.push('/home')
    }
}

</script>

<style lang="scss" scoped>

</style>